/*
 * @Description:
 * @Author: fhw
 * @Date: 2023-02-26 15:36:37
 */
import { useRequest, useSearch } from '@/hooks'
import { defaultParams, deleteData, } from '@/utils'
import { clone, } from 'ramda'
import { defineComponent, reactive, toRaw, } from 'vue'
import { rows, columns } from './uilts'
import CreateIndex from './components/createIndex'
import { useRouter } from 'vue-router'
export default defineComponent({
	name: 'MoviesList',
	setup() {
		const $router = useRouter()
		const pageState = reactive({
			visible: false,
			dataSource: {} as defs.server.MovieEntity,
		})
		const { searchForm, expand, expandToggle } = useSearch<API.server.movie.getMoviePage.Params>({})
		function search(is = true) {
			const params = clone(toRaw(searchForm.value))
			run({
				...params,
				...getPagination(is),
			} as any)
		}
		function clear() {
			searchForm.value = {}
			search()
		}
		const { run, data, getPagination, renderPagination, loading } = useRequest(
			API.server.movie.getMoviePage.request,
			{
				manual: true,
				pagination: true,
				defaultParams: [{}]
			}
		)
		function actionRender({ record }: F.RableSlotScope<defs.server.MovieEntity>) {
			return (
				<a-space size="middle">
					<a-button
						type="link"
						block
						v-auth="edit"
						onClick={() => {
							$router.push({ path: '/movies/episode/' + record.id })
						}}
					>
						资源
					</a-button>
					<a-button
						type="link"
						block
						v-auth="edit"
						onClick={() => {
							pageState.dataSource = clone(record)
							pageState.visible = true
						}}
					>
						编辑
					</a-button>
					<a-button type="link" v-auth="del" block danger onClick={() =>
						deleteData({ id: record.id as number },
							API.server.movie.deleteMovie.request,
							() => search(false))}>
						删除
					</a-button>
				</a-space>
			)
		}
		function tableHeader() {
			return [
				<a-button
					type="primary"
					v-auth="add"
					onClick={() => {
						pageState.visible = true
						pageState.dataSource = {} as defs.server.MovieEntity
					}}
				>
					新增
				</a-button>,
			]
		}
		return () => (
			<div>
				<f-search
					labelCol={{ span: 6 }}
					wrapperCol={{ span: 18 }}
					loading={loading.value}
					clear={clear}
					search={search}
					expand={{
						value: expand.value,
						expandToggle,
					}}
					searchKey="moviesListSearchKey"
					model={searchForm.value}
					rows={rows}
				/>
				<f-table
					v-slots={{ header: tableHeader, actionRender }}
					columns={columns}
					dataSource={data.value?.data?.data ?? []}
					loading={loading.value}
					rowKey="id"
					tableKey="moviesListTable"
				/>
				{renderPagination()}
				<CreateIndex
					visible={pageState.visible}
					dataSource={pageState.dataSource}
					onCancel={() => {
						pageState.visible = false
						pageState.dataSource = {} as defs.server.MovieEntity
					}}
					onSearch={() => search(false)}
				/>
			</div>
		)
	},
})
